<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="../../css/reset.css"/>
	<link rel="stylesheet" type="text/css" href="../../css/add.css"/>
	<script>
		function resetData() {
			$(".header:eq(1), .content:eq(1)").hide();
		}
	</script>
</head>
<body>
<div id="app">
	<div class="header">
		<span>修改用户</span>
	</div>
	<div class="content">
		<table>
			<tr>
				<td class="text-right">手机号码</td><td class="content_right">
				<input id="phone" class="input inline-input" placeholder="请输入手机号码">
				<span class="btn btn-info" id="find">立即查找</span></td>
			</tr>
		</table>
	</div>


	<div class="header">
		<span>查找信息如下</span>
	</div>
	<div class="content">
		<table>
			<tr>
				<td class="text-right">昵称</td><td class="content_right"><input class="input" placeholder="请输入昵称(1-32位有效字符)"></td>
			</tr>
			<tr>
				<td class="text-right">手机号码</td><td class="content_right"><input class="input" placeholder="请输入手机号码"></td>
			</tr>
			<tr>
				<td class="text-right">身份证号码</td><td class="content_right"><input class="input" placeholder="请输入身份证号码"></td>
			</tr>
			<tr>
				<td class="text-right">密码</td><td class="content_right"><input class="input" placeholder="请输入密码(6-32位有效字符)"></td>
			</tr>
			<tr>
				<td></td><td class="content_right">
				<span class="btn btn-info" id="update">立即修改</span>
				<span class="btn" onclick="resetData()">重置</span> </td>
			</tr>
		</table>
	</div>
</div>
</body>
<script src="/js/jquery2.1.4.js"></script>
<script src="/layer/layer.js"></script>
<script>
	$(".header:eq(1), .content:eq(1)").hide();
	var userId = null;
	var phone = null;
	$(function () {
		$("#find").click(function () {
			var windowId = layer.load();
			var phone = $("#phone").val();
			if (phone === "") {
				layer.close(windowId);
				layer.msg("手机号码不能为空！");
			}else {
				if (phone.match(/^1[3-9]\d{9}$/) === null) {
					layer.close(windowId);
					layer.msg("请输入正确的手机号码！");
				}else {
					$.getJSON("/user/find.do", {phone: phone}, function (data) {
						layer.close(windowId);
						layer.msg(data.content);
						if (data.status === 0) {
							$(".header:eq(1), .content:eq(1)").fadeIn(1000);
							userId = data.data.id;
							phone = data.data.phone;
							$(".input:eq(1)").val(data.data.nickName);
							$(".input:eq(2)").val(phone);
							$(".input:eq(3)").val(data.data.idCard);
							$(".input:eq(4)").val(data.data.password);
						}
					});
				}
			}
		});

		$("#update").click(function () {
			var windowId = layer.load();
			var nickName = $(".input:eq(1)").val();
			var phone = $(".input:eq(2)").val();
			var idCard = $(".input:eq(3)").val();
			var password = $(".input:eq(4)").val();
			var User = {
				id:userId,
				nickName:nickName,
				phone:phone,
				idCard:idCard,
				password:password
			}
			$.post("/user/update.do", User, function (data) {
				layer.close(windowId);
				layer.msg(data.content);
				if (data.status === 0) {
					resetData();
				}
			}, "JSON");
		});

		$(".input:eq(1)").blur(function () {
			var str = $(this).val();
			if (str.trim() === "") {
				layer.msg("昵称不能为空！");
				$(this).focus();//选中input输入框
				$(this).select();//全选input输入框内输入内容
				$("#update").unbind("click");
			}else {
				if (str.match(/^[\u4e00-\u9fff\w]{1,32}$/) === null) {
					layer.msg("昵称不合法！");
					$(this).focus();//选中input输入框
					$(this).select();//全选input输入框内输入内容
					$("#update").unbind("click");
				}else {
					$("#update").bind("click");
				}
			}
		});

		$(".input:eq(2)").blur(function () {
			var str = $(this).val();
			if (str.trim() === "") {
				layer.msg("手机号码不能为空！");
				$(this).focus();//选中input输入框
				$(this).select();//全选input输入框内输入内容
				$("#update").unbind("click");
			}else {
				if (str.match(/^1[3-9]\d{9}$/) === null) {
					layer.msg("请输入正确的手机号码！");
					$(this).focus();//选中input输入框
					$(this).select();//全选input输入框内输入内容
					$("#update").unbind("click");
				}else {
					$("#update").bind("click");
				}
			}
		});

		$(".input:eq(3)").blur(function () {
			var str = $(this).val();
			if (str.trim() === "") {
				layer.msg("身份证号码不能为空！");
				$(this).focus();//选中input输入框
				$(this).select();//全选input输入框内输入内容
				$("#update").unbind("click");
			}else {
				if (str.match(/^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/) === null) {
					layer.msg("请输入正确的身份证号码！");
					$(this).focus();//选中input输入框
					$(this).select();//全选input输入框内输入内容
					$("#update").unbind("click");
				}else {
					$("#update").bind("click");
				}
			}
		});

		$(".input:eq(4)").blur(function () {
			var str = $(this).val();
			if (str.trim() === "") {
				layer.msg("密码不能为空！");
				$(this).focus();//选中input输入框
				$(this).select();//全选input输入框内输入内容
				$("#update").unbind("click");
			}else {
				if (str.match(/^[A-Za-z0-9_]{6,32}$/) === null) {
					layer.msg("密码不合法！");
					$(this).focus();//选中input输入框
					$(this).select();//全选input输入框内输入内容
					$("#update").unbind("click");
				}else {
					$("#update").bind("click");
				}
			}
		});
	})
</script>
</html>
